<template>
  <div class="home">  
          <div class="box1">
                  <div class="info1" >
                      <div class="head"> 
                          <img :src="usersDetail.pic" alt="">
                      </div>
                      <div class="name">
                          <div style="font-size:1rem">{{usersDetail.name}}</div>
                          <div  style="color:#8b8b8b">卡号:{{usersDetail.number}}</div>
                         
                      </div>
                  </div>
          </div>
           <div class="box2">
                        <div>
                            <div>昵称：</div>
                            <div>{{usersDetail.name}}</div>
                        </div>
                        <div>
                            <div>性别：</div>
                            <div>{{usersDetail.sex==1?'男':'女'}}</div>
                        </div>
                       
           </div>
  </div>
</template>
<script>
import {hideWxMenu } from '@/assets/js/tools'
import { mapState,mapActions } from "vuex";
export default {
  name: 'home',
    data() {
    return {
      
opneid:'',
      
    }
    },
    mounted(){
      let t=this;
      
     hideWxMenu()
       t.opneid=localStorage.getItem('openid')
 
          if(!t.usersDetail.id){
            t.GetUsersDetail({openid:localStorage.getItem('openid')})  
        }
    },
   computed: {
    ...mapState(['usersDetail']),
  },
  methods: { 
    ...mapActions([
				'GetUsersDetail',
			]),
    linkTo(url){
          this.$router.push({name:url})  
    },
  },
}
</script>
<style scoped lang="less">
.home{
  height: 100vh;
    background: #ededed;
} 
.box1{
          background: #ffffff;
        padding: .2rem .5rem;
         >.info1{
             padding: .5rem 0;
             display: flex;
             align-items: center;
             >.head{
              img{
                width: 3rem;
                border-radius: 50%;
              }
            }
            >.name{
                font-size: .7rem;
                
                margin-left: .5rem;
                >div{
                    line-height: 1.3rem;
                }
            }
         }

    }
.box2{
    background-color: white;
    padding: .5rem;
    >div{
        display: flex;
        line-height:3rem;
        border-top: 1px solid #ebebeb;
        font-size: .7rem;
    }
}
</style>
 